在 官方文件 裡面進行了對於 Hooks 的一些分類，我將常用的幾個 Hooks 整理成以下內容：
1. State Hooks
這個分類的 Hook 就是用來保存資訊的，例如表單元件的輸入值、切換元件是否顯示在畫面上，常見的 State Hooks 有：
- useState：可以宣告一個可以更新狀態的變數
- UseReducer：在一個 reducer 函數裡面宣告帶有更新邏輯的狀態變數
2. Context Hooks
這個 Hooks 主要用來處理的情境是從父層元件傳送資訊給子層資訊，而且不管子層元件多深層都可以傳，而且不用把資料帶到每個子元件當成參數傳遞。
常見的 State Hooks 有：
- useContext
3. Ref Hooks
這個跟 State Hooks 有點像，都是用來保存資訊的，但不一樣的點是，Ref Hooks 不會對 Component 進行重新渲染。
常見的 State Hooks 有：
- useRef：最常用 useRef 來保存 DOM 節點，因為 DOM 節點本身不太會有改變，改變的是 DOM 節點的屬性比如說 src, width, height...
4. Effect Hooks
Effect Hooks 會用來處理一些非同步的情況，比如說請求 API。
- useEffect
5. Performance Hooks
這邊的 Hooks 是用來優化效能的，避免重複執行不必要的方法或變數。
常見的 State Hooks 有：
- useMemo：緩存你要保存的變數
- useCallback：緩存你要保存的方法
總結
useState 和 useReducer，用於處理元件的內部狀態。Context Hooks 則讓我們能夠更方便地在元件樹中傳遞資訊，而 Ref Hooks 則是保存資訊而無需引起重新渲染的好選擇。
透過 Effect Hooks，我們可以處理非同步操作，例如請求 API，使應用程式更具動態性。最後，Performance Hooks 如 useMemo 和 useCallback 提供了優化效能的手段，避免不必要的計算和函數執行。
在你的 React 開發旅程中，善用這些 Hooks 將使你的程式碼更簡潔、可讀性更高，同時提升應用程式的效能。希望這篇文章能幫助你更深入了解並合理運用 React 中的 Hooks。接下來我也會慢慢整理一些文章來用淺白的方式說明以上提到的 Hooks 的用法~
